<div class="layuimini-main" id="people-input">

    <div class="layui-form layuimini-form  layui-form-pane" lay-filter="people-input_div_filter">
        <h2>导入示例</h2>
        <img src="/page/People/InputDemp.jpg" />
        <br />
        <br />
        导入文件支持 Excel格式的 .xls 文件或.xlsx文件，图片需先上传到可以直链的网盘或图片服务器。
        <a class="layui-btn layui-btn-normal" href="/page/People/input.xlsx">点击下载示例</a>
        <br />
        <hr />
        <br />
        <br />
        <div class="layui-form-item">

            <div class="layui-inline">
                <label class="layui-form-label required">导入文件</label>
                <div class="layui-input-inline">
                    <input type="text" disabled id="txtInputFile" autocomplete="off" class="layui-input">
                </div>
            </div>

            <button type="button" class="layui-btn layui-btn-normal" id="btnSelectXLS"><i class="layui-icon">&#xe67c;</i>选择</button>
            <button type="button" class="layui-btn layui-btn-normal" id="btnDeleteXLS"><i class="layui-icon">&#x1006;</i>删除</button>
        </div>

        <div class="layui-form-item defcenter">
            <button class="layui-btn layui-btn-normal" lay-submit lay-filter="btnInput"><i class="layui-icon">&#xe605;</i>开始导入</button>
            <button class="layui-btn layui-btn-warm" id="BtnPeopleInputCancel"><i class="layui-icon">&#x1006;</i>取消</button>
        </div>
    </div>
</div>
<script>
    layui.use(['form', 'upload', 'faceAPI'], function () {
        var form = layui.form,
            layer = layui.layer,
            $ = layui.$;
        var faceAPI = layui.faceAPI;


        /**
         * 初始化表单，要加上，不然刷新部分组件可能会不加载
         */
        form.render();

        faceAPI.PeopleInputPageResult = { result: false };

        // 当前弹出层，防止ID被覆盖
        var parentIndex = layer.index;

        var loadIndex = 0;

        var upload = layui.upload;
        var xlsfile = null;

        //选择文件
        var uploadInst = upload.render({
            elem: '#btnSelectXLS' //绑定元素
            , url: '/upload/' //上传接口
            , auto: false
            , accept: 'files'
            , exts: 'xls|xlsx'
            , choose: function (obj) {
                //将每次选择的文件追加到文件队列
                var files = obj.pushFile();

                //预读本地文件，如果是多文件，则会遍历。(不支持ie8/9)
                obj.preview(function (index, file, result) {
                    //debugger;
                    if (file.type != 'application/vnd.ms-excel' && file.type != 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet') {
                        layer.alert("仅支持 .xls 和 .xlsx 文件格式！", { icon: 2 });
                        return;
                    }
                    $('#txtInputFile').val(file.name);
                    xlsfile = file;
                });
            }
        });

        //删除文件
        $('#btnDeleteImage').on('click', function () {
            $('#txtInputFile').val('');
            xlsfile = null;

            return false;
        });


        //保存
        form.on('submit(btnInput)', function (data) {
            if (xlsfile == null) {
                layer.alert('请选择一个Excel文件', { icon: 2 });
                return false;
            }
            var formData = new FormData();
            formData.append("inputfile", xlsfile);
            var loadIndex = layer.load(1, { shade: [0.6, '#e2e2e2'] }); //0.1透明度的白色背景
            faceAPI.Ajax({
                type: 'Post',
                data: formData,
                contentType: false,
                processData: false,
                url: '/api/People/InputPeopleByExcel',
                success: function (result) {
                    layer.close(loadIndex);
                    if (result.result == false) {
                        layer.alert(result.error, { icon: 2 });
                    }
                    else {

                        faceAPI.PeopleInputPageResult = result;

                        layer.close(parentIndex);
                    }
                }
            });
            return false;
        });

        //取消操作，关闭窗口
        $('#BtnPeopleInputCancel').on('click', function () {
            faceAPI.PeopleEditPageResult.result = false;
            layer.close(parentIndex);
            return false;
        });







    });


</script>